<include file='Base:header' />
<style>
	table{
		font-size: 12px;
	}
	.table-bordered {
	    border-bottom: 1px solid #d9d9d9;
	    border-collapse: separate;
	    border-left: 0;
	    -webkit-border-radius: 3px;
	    -moz-border-radius: 3px;
	    border-radius: 3px;
	}
	.table-list {
	    margin-bottom: 0px;
	}
	.table_right,.table_left {
		width: 800px;
		text-align: center;
	    max-width: 100%;
	    background-color: #fff;
	    border-collapse: collapse;
	    border-spacing: 0;
		float: left;
	}
	.table_left{
		width: 80px;
	}
/* 	.table_right>thead>tr>th,.table_left>thead>tr>th{
	    border-bottom: 1px solid #d9d9d9;
	} */
	.table_right thead th,.table_left thead th {
	    vertical-align: bottom;
	}
	.table_right th, .table_right td,.table_left th, .table_left td {
		text-align: center;
	    vertical-align: middle;
	}
	.table-bordered th, .table-bordered td {
	    border-left: 1px solid #d9d9d9;
	}
	.table_right th, .table_right td,.table_left th, .table_left td  {
	    padding: 6px 0;
	    line-height: 20px;
	    text-align: left;
	    vertical-align: top;
	    border-top: 1px solid #d9d9d9;
	}
	.table_right th,.table_left th{
		line-height: 23px;
		height: 60px;
		text-align: center;
		width: 27px;
		color: black;
		font-weight: normal;
		box-sizing: border-box;
	}
	.table_right th:nth-of-type(1),.table_right td:nth-of-type(1){
		border-left: none;
	}
	.rb tr:nth-of-type(1) td,.lb tr:nth-of-type(1) td{
		border-top: none;
		line-height: 21px;
	}
	.table_left th,.table_left td{
		border-right:  1px solid #d9d9d9;
	}
	.table_right td,.table_left td{
		text-align: center;
		overflow: scroll;
		width: 50px;
		color: #999;
		box-sizing: border-box;
	}
	.table_right td {
	    height: 33px;
	}
	.lt_top{
		position: fixed;
		left: 0;
		top: 115px;
		z-index: 100;
	}
	.lb_top{
		margin-top: 60px;
	}
	.rt_top{
		position: fixed;
		left: 80px;
		top: 115px;
		z-index: 50;
		width: 800px;
	}
	.rb_top{
		margin-top: 60px;
	}
	.lt_left{
		position: fixed;
		left: 0;
		top: 115px;
		z-index: 100;
	}
	/*.lb_left{
		margin-top: 60px;
	}*/
	.rt_left{
		position: absolute;
		top:0;
		z-index: 50;
		width: 800px;
	}
	.rb_left{
		margin-top: 60px;
	}
</style>
	<body>
		<div class="out_list">
			<h1 class="title">
				<a class="back" href="{$goback}">
					<img class="fl" src="__IMG__/back.png" style="margin-left: 5%;"/>
				</a>
				团队考勤
				<a class="home" href="__APP__">
					<img class="fl" src="__IMG__/home_logo.png" style="margin-right: 5%;"/>
				</a>
			</h1>
			<div class="weui-tab">
				<div class="weui-navbar">
					<a class="weui-navbar__item weui-bar__item--on" href="#tab1">
					  	本月
					</a>
					<a class="weui-navbar__item" href="#tab2">
					  	上月
					</a>
				</div>
				<div class="weui-tab__bd">
					<div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active" style="position: relative;">
						<include file='Team:_formleft' data='$cur_mon' />
						<include file='Team:_formright' data='$cur_mon' />
					</div>
					<div id="tab2" class="weui-tab__bd-item" style="position: relative;">
					    <include file='Team:_formleft' data ='$last_mon'/>
					    <include file='Team:_formright' data ='$last_mon'/>
					</div>
				</div>
			</div>		
		<include file='Base:footer' />
		
		<script type="text/javascript">
			var hei = $(window).height();
			var wid = $(window).width();
			$(".tab2_div").width(wid-80);
//			$(".tab2_div table").width(800);
			var max_hei = hei - 65 - 50;
			$(".out_list .weui-tab__bd .weui-tab__bd-item").css("max-height",max_hei)
//			$(".weui-tab__bd-item--active").scroll(function(){
//				var scroll_left = $(this).scrollLeft();
//				$(".weui-tab__bd-item--active .rt").removeClass("rt_left");
//				$(".weui-tab__bd-item--active .lt").addClass("lt_top");
//				$(".weui-tab__bd-item--active .rt").addClass("rt_top");
//				$(".weui-tab__bd-item--active .lb").addClass("lb_top");
//				$(".weui-tab__bd-item--active .rb").addClass("rb_top");
//			});
			$(".weui-tab__bd-item--active .tab2_div").scroll(function(){
				var scroll_left = $(this).scrollLeft();
				$(".rt_top").attr("left",scroll_left)
				$(".weui-tab__bd-item--active .rt").removeClass("rt_top");
				$(".weui-tab__bd-item--active .rb").removeClass("rb_top");
//				$(".weui-tab__bd-item--active .lt").addClass("lt_left");
				$(".weui-tab__bd-item--active .rt").addClass("rt_left");
//				$(".weui-tab__bd-item--active .rt_left").css("left",0-scroll_left)
				$(".weui-tab__bd-item--active .lb").addClass("lb_left");
				$(".weui-tab__bd-item--active .rb").addClass("rb_left");
			});
		</script>
	</body>
</html>